<%@ page pageEncoding="UTF-8"%>
<%@ taglib prefix="cw" uri="/widget-tags"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
	<head>
		<cw:base />
	</head>
	<body>
		<cw:form>
			<li>
				<b> 最基本的输入框，可以进行任何可打印字符的输入，并将输入的字符原样显示 </b>
			</li>
			<li>
				<b> 以下示例分别展现了文本输入框的一些使用场景，如必填、设定长度范围、密码及事件操作</b>
			</li>
			<br />
			<br />
			<li>
				必填设置，设置required=true，失焦或者表单提交时会进行有效性验证，输入域边框颜色会变化
				<table>
					<tr>
						<td align="right">
							<font color="red">*</font>姓名:
						</td>
						<td>
							<cw:text property="name" required="true" />
						</td>
					</tr>
				</table>
				<br />
			</li>
			<li>
				长度校验，设置maxLength="20" minLength="8"，设置cnCharacter=true会把中文当成2个字符(即Length/2)，失焦或者表单提交时会进行有效性验证，输入域边框颜色会变化
				<table>
					<tr>
						<td align="right">
							地址:
						</td>
						<td>
							<cw:text property="address" maxLength="20" minLength="8" cnCharacter="true" value="上海市" />
						</td>
					</tr>
				</table>
				<br />
			</li>
			<li>
				密码掩码，设置type="password"，即为密码输入域
				<table>
					<tr>
						<td align="right">
							密码:
						</td>
						<td>
							<cw:text property="password" minLength="6" type="password" value="123456" />
						</td>
					</tr>
				</table>
				<br />
			</li>
			<li>
				定义事件触发后的操作，设置格式为listeners="{'事件名称':function(){事件方法}}"，聚焦至输入框后触发
				<table>
					<tr>
						<td align="right">
							地址:
						</td>
						<td>
							<cw:text property="address" emptyText="请输入地址..."
								listeners="{'focus':function(){alert('请输入地址...')},'blur':function(){this.setValue('上海市联航路1518号')}}" />
						</td>
					</tr>
				</table>
			</li>
		</cw:form>
	</body>
	<cw:theme></cw:theme>
</html>
